<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html>
<html>
  <head>
    <title>换电记录</title>
    <base href="<%=basePath%>">
    <script src="lib/timePicker/WdatePicker/WdatePicker.js"></script>
  </head>
  
  <body>
  
  	<jsp:include page="common.jsp"></jsp:include>
  	<jsp:include page="alert.jsp"></jsp:include>
  	
  	<div class="secMenu-content">
  		<div class="list-hearBar">
	  		<form class="form-inline list-headRight right" role="form">
	  			换电日期 <input type="text" class="form-control Wdate sheet-searchInput" placeholder="" onFocus="WdatePicker({lang:'zh-cn'})"> 至
	  			<input type="text" class="form-control Wdate sheet-searchInput" placeholder="" onFocus="WdatePicker({lang:'zh-cn'})">
	  			
				<input type="text" class="form-control sheet-searchInput" placeholder="请输入司机手机号">
				<input type="text" class="form-control sheet-searchInput" placeholder="请输入车牌号">
							  
				<select class="form-control">
				  <option>选择站点</option>
				  <option>西斗门</option>
				  <option>西溪</option>
				</select>
				
				<select class="form-control">
				  <option>所属公司</option>
				  <option>时空电动</option>
				</select>
				
				<select class="form-control">
				  <option>车型</option>
				  <option>SKKD</option>
				</select>
				
				<button type="submit" class="btn btn-info">搜索</button>
			</form>
  		</div>
  	
  	 	<table class="table table-hover table-striped table-condensed list-table">
	      <thead>
	        <tr>
	          <th>时间</th>
	          <th>车辆</th>
	          <th>费用/金额</th>
	          <th>司机</th>
	          <th>手机号</th>
	          <th>所属公司</th>
	          <th>SOC</th>
	          <th>行驶/总里程</th>
	          <th>套餐里程使用</th>
	          <th>套餐次数使用</th>
	          <th>网点</th>
	          <th>备注</th>
	          <th>状态</th>
	          <th>操作</th>
	        </tr>
	      </thead>
	      
	      <tbody>
	        <tr>
	          <td>11-23 13:51</td>
	          <td>K11-浙AG359E</td>
	          <td>40.0/50.0</td>
	          <td>赵四</td>
	          <td>13800000000</td>
	          <td>乐施网络</td>
	          <td>20%</td>
	          <td>101/55680</td>
	          <td>0/0</td>
	          <td>1/10</td>
	          <td>西斗门</td>
	          <td></td>
	          <td>正常</td>
	          <td class="list-action">
	          	<a href="javascript:;" class="batteryBtn">电池</a>
	          </td>
	        </tr>
	        
	        <tr>
	          <td>11-24 13:51</td>
	          <td>K11-浙AG359E</td>
	          <td>40.0/50.0</td>
	          <td>赵四</td>
	          <td>13800000000</td>
	          <td>乐施网络</td>
	          <td>20%</td>
	          <td>101/55680</td>
	          <td>0/0</td>
	          <td>1/10</td>
	          <td>西斗门</td>
	          <td></td>
	          <td>正常</td>
	          <td class="list-action">
	          	<a href="javascript:;" class="batteryBtn">电池</a>
	          </td>
	        </tr>
	      </tbody>
	    </table>
	    
	    <nav>
		  <ul class="pagination right">
		    <li><a href="javascript:;">首页</a></li>
		    <li class="active"><a href="javascript:;">1</a></li>
		  	<li><a href="javascript:;">2</a></li>
		    <li><a href="javascript:;">3</a></li>
		    <li><a href="javascript:;">4</a></li>
		    <li><a href="javascript:;">5</a></li>
		    <li><a href="javascript:;">尾页</a></li>
		  </ul>
		</nav>
	</div>
	
	<!-- 电池-->
   <div class="modal fade " id="batteryModal" data-backdrop="static">
	  <div class="modal-dialog modal-lg">
	    <div class="modal-content">
	      <div class="modal-header">
	        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
	        <h4 class="modal-title">电池使用情况</h4>
	      </div>
	      <div class="modal-body">
	        <table class="table table-hover">
	     	   <thead>
	     	   	   <tr>
	     	   		  <th>#</th>
			          <th>电池编号</th>
			          <th>换上/下</th>
			          <th>当前SOS</th>
			          <th>当前电压</th>
			          <th>正对地</th>
			          <th>负对地</th>
			          <th>最大电压</th>
			          <th>最小电压</th>
			          <th>最高温度</th>
			          <th>最低温度</th>
	     	   	   </tr>
	     	   </thead>
	     	   <tbody>
	     	   		<tr>
	     	   		  <td>1</td>
	     	   		  <td>看不清</td>
	     	   		  <td>换下</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>4153</td>
	     	   		  <td>4143</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   	   </tr>
	     	   	   <tr>
	     	   		  <td>2</td>
	     	   		  <td>看不清</td>
	     	   		  <td>换下</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>4153</td>
	     	   		  <td>4143</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   	   </tr>
	     	   	   <tr>
	     	   		  <td>3</td>
	     	   		  <td>看不清</td>
	     	   		  <td>换下</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   		  <td>4153</td>
	     	   		  <td>4143</td>
	     	   		  <td>无</td>
	     	   		  <td>无</td>
	     	   	   </tr>
	     	   </tbody>
     	   </table>

	      </div>
	    </div><!-- /.modal-content -->
	  </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->
	
	<script type="text/javascript">
		$(document).ready(function(){
			batteryEvent();//电池使用情况
		});
		
		function batteryEvent(){
			//电池使用情况
			$(".batteryBtn").on("click",function(){
				$("#batteryModal").modal('show');
				
			});
		}
		
	</script>
  </body>
</html>

